<template>
	<div class="Search">
		<form>
			<input type="text" placeholder="Montagne jeunesse" class="text" />
			<input type="submit" class="submit" value="" />
		</form>
	</div>
	
</template>

<script>
	export default{
		name:'Search'
	}
</script>

<style scoped>
	.Search{
		width:516px;
		height: 60px;
		border-radius: 15px;
		overflow: hidden;
		position: relative;
	}
	.Search:after{
		content: "";
		display: block;
		height: inherit;
		width:inherit;
		background: #fff;
		opacity: 0.8;
		position: absolute;
		z-index: 1;
	}
	.Search form{
		width:inherit;
		height: inherit;
		position: absolute;
		background: none;
		z-index: 2;
	}
	.Search form input{
		height: inherit;
		float:left;
		background: none;
	}
	.Search form .text{
		width:436px;
		color:#999;
		font-size: 28px;
		padding-left:20px;
	}
	.Search form .submit{
		width:60px;
		background: url("~img/common/search.png") no-repeat left;
		background-size: 37px;
	}
</style>